<style lang="scss" scoped>
</style>

<template>
  <el-dialog v-model="visible" title="竞价发布订单" @close="handleClose" width="600px">
    <div class="modal_content">
      <el-form :model="handleForm" ref="formRef" label-width="100" :rules="blankRules">
        <el-row>
          <el-col :span="12">
            <el-form-item label="竞价阈值" prop="price">
              <el-input class="all_width" style="width: 200px;" v-model="handleForm.price"  placeholder="请输入竞价阈值"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="总方数" prop="totalSquare">
              <el-input class="all_width" style="width: 200px;" v-model="handleForm.totalSquare" placeholder="请输入总方数"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="物流公司" prop="biddingCompanyReqs">
              <el-select v-model="handleForm.biddingCompanyReqs" multiple placeholder="请输入物流公司">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"/>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="时间" prop="biddingLength">
              <el-input class="all_width" style="width: 150px;" v-model="handleForm.biddingLength"  placeholder="请输入竞价时间"></el-input>分钟
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="发货地址" prop="shippingAddress">
          <el-select style="width: 1000px" v-model="handleForm.shippingAddress" filterable placeholder="请输入发货地址" clearable>
            <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="备注">
          <el-input v-model="handleForm.remark" type="textarea" placeholder="请输入备注"/>
        </el-form-item>
      </el-form>
    </div>
    <template #footer>
      <div class="modal-btn-list">
        <div>
          <el-button @click="handleClose">取消</el-button>
          <el-button type="primary"  @click="submitForm(formRef)">确认</el-button>
        </div>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import { reactive, ref, defineEmits, getCurrentInstance } from "vue";
import {postPageCompanyInformation} from "@/api/outOrder.js"
import {postBiddingOrder} from "@/api/BiddingOrder.js"

const formRef = ref();
const emit = defineEmits(["ok"]);
const visible = ref(false);
const detailType = ref("");
const message = inject("message");
// 控制是否禁用
const isDisabled = ref(false);
let handleForm = reactive({
  price: "",
  totalSquare: "",
  remark: "",
  biddingCompanyReqs:[],
  shippingOrderNumber:"",
  biddingLength:"60",
  shippingAddress:""
});
const blankRules = reactive({
  price: [{ required: true, message: "请输入竞价阈值", trigger: "blur" }],
  totalSquare: [
    { required: true, message: "请输入总方数", trigger: "blur" },
  ],
  biddingCompanyReqs: [{ required: true, message: "请选择物流公司", trigger: "blur" }],
  biddingLength: [{ required: true, message: "请输入时间", trigger: "blur" }],
  shippingAddress: [{ required: true, message: "请输入发货地址", trigger: "blur" }],
});

const options1 = [
  {
    value: '福建省三明市宁化县城南工业园区宁化月兔科技有限公司',
    label: '福建省三明市宁化县城南工业园区宁化月兔科技有限公司',
  },
  {
    value: '广东省中山市南头镇园林路7号TCL暖通四号岗',
    label: '广东省中山市南头镇园林路7号TCL暖通四号岗',
  },
  {
    value: '嘉兴海盐县海城路468号创能新能源股份有限公司',
    label: '嘉兴海盐县海城路468号创能新能源股份有限公司',
  },
  {
    value: '浙江省乐清市乐清弯港区乐商创业园创新路9号',
    label: '浙江省乐清市乐清弯港区乐商创业园创新路9号',
  },
]
const options = ref([])

onMounted((tab) => {
  // getDeliveList()
})

// 打开
const getParent = (type, item) => {
  handleForm.id = type.id
  handleForm.shippingOrderNumber = type.shippingOrderNumber
  const deliverInfo = type.companyInfo
  options.value = [];
  deliverInfo.forEach(item => {
    options.value.push({
      value: item.id,
      label: item.companyName
    })
  })
  detailType.value = type;
  isDisabled.value = false;
  visible.value = true;
};



const submitForm = async (form) => {
  try {
    console.log(handleForm.biddingCompanyReqs)
    const info = handleForm.biddingCompanyReqs
    handleForm.biddingCompanyReqs = [];
    info.forEach((selectedValue) => {
      const selectedOption = options.value.find((option) => option.value === selectedValue);
      if (selectedOption) {
        handleForm.biddingCompanyReqs.push({
          companyId: selectedOption.value,
          companyName: selectedOption.label,
        });
      }
    });
    await form.validate();
    await postBiddingOrder(handleForm);
    message.notify('success','发布成功')
    handleClose();
    emit("ok");
    console.log('表单验证通过，接口调用成功');
  } catch (error) {
    console.error('表单验证失败或接口调用失败', error);
  }
};
// 关闭
const handleClose = () => {
  formRef.value.resetFields();
  visible.value = false;
  // location.reload()
};

defineExpose({
  getParent,
});
</script>